
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="学生成绩信息管理系统">
    <meta name="author" content="">
    <title>学生端--按学期查询-按钮页面</title>
    <link rel="icon" href="/helps/img/favicon.ico" type="image/png">
    <link href="/plugins/bootstrap-4.0.0/css/bootstrap.min.css" rel="stylesheet">
    <link href="/helps/css/bottom.css" rel="stylesheet">
    <style>
        /* 自定义表格表头背景颜色 */
        .table-custom thead th {
            background-color: #d4edda; /* 浅绿色 */
            color: #000; /* 文字颜色 */
        }
        .table-custom {
            border: 1px solid #dee2e6; /* 定义表格边框样式 */
            border-collapse: collapse; /* 合并边框使之更紧凑 */
        }
        .table-custom th,
        .table-custom td {
            border: 1px solid #dee2e6; /* 定义单元格边框样式 */
            padding: 8px; /* 添加内边距 */
        }

        /* 自定义搜索表单样式 */
        .custom-form .input-group {
            max-width: 500px;
            margin: auto;
        }

        .custom-form .input-group .custom-select {
            border-top-left-radius: 25px;
            border-bottom-left-radius: 25px;
        }

        .custom-form .input-group .btn {
            border-top-right-radius: 25px;
            border-bottom-right-radius: 25px;
            background-color: #d4edda; /* 浅绿色 */
            color: #000000;
        }

        .custom-form .input-group .btn:hover {
            background-color: #479658;
        }
        /* 定义箭头的样式 */
        .page-link {
            color: #98c4a2; /* 浅绿色 */
        }


    </style>
</head>
<body>
<div th:replace="commons/stubar::topbar"></div>
<div class="container-fluid">
    <div class="row">
        <div th:replace="commons/stubar::#sidebar(activeUri='result')"></div>
        <main role="main" class="col-md-9 ml-sm-auto col-lg-10 pt-3 px-4">
            <form method="get" th:action="@{/stu/selectResByTerm/1}" class="custom-form my-4">
                <div class="input-group">
                    <select class="custom-select" name="resTerm">
                        <option value="">学期</option>
                        <option value="2023-2024-1">2023-2024-1</option>
                        <option value="2023-2024-2">2023-2024-2</option>
                    </select>
                    <div class="input-group-append">
                        <button class="btn btn-outline-secondary" type="submit" id="button-addon2">查询</button>
                    </div>
                </div>
            </form>


            <div class="table-responsive">
                <div class="table-responsive">
                    <table class="table table-hover table-custom">
                        <thead>
                        <tr>
                            <th scope="col">序号</th>
                            <th scope="col">课程名</th>
                            <th scope="col">成绩</th>
                            <th scope="col">学期</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr th:each="res, iterStat : ${pageInfo.list}" th:if="${res != null}">
                            <th scope="row" th:text="${iterStat.index + 1}"></th>
                            <td th:text="${res.subName}"></td>
                            <td th:text="${res.resNum}"></td>
                            <td th:text="${res.resTerm}"></td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
            <nav aria-label="Page navigation example">
                <ul class="pagination justify-content-center">
                    <!--  代表快速回到首页 -->
                    <li class="page-item"><a class="page-link" th:href="@{'/stu/selectResByTerm/1?resTerm=' + ${resTerm}}"> << </a></li>
                    <!-- 上一页-->
                    <li class="page-item" th:classappend="${!pageInfo.hasPreviousPage} ? 'disabled'">
                        <a class="page-link" th:href="@{'/stu/selectResByTerm/' + (${pageInfo.pageNum - 1}) + '?resTerm=' + ${resTerm}}" tabindex="-1">←</a>
                    </li>
                    <!-- 页数 -->
                    <li class="page-item" th:each="page_Num : ${pageInfo.navigatepageNums}">
                        <a class="page-link"
                           th:href="@{'/stu/selectResByTerm/' + ${page_Num} + '?resTerm=' + ${resTerm}}"
                           th:classappend="${page_Num == pageInfo.pageNum} ? 'active'">
                            <span th:text="${page_Num}"></span>
                        </a>
                    </li>
                    <!-- 下一页 -->
                    <li class="page-item" th:classappend="${!pageInfo.hasNextPage} ? 'disabled'">
                        <a class="page-link" th:href="@{'/stu/selectResByTerm/' + (${pageInfo.pageNum + 1}) + '?resTerm=' + ${resTerm}}">→</a>
                    </li>
                    <!-- 代表快速到末页 -->
                    <li class="page-item">
                        <a class="page-link" th:href="@{'/stu/selectResByTerm/' + ${pageInfo.pages} + '?resTerm=' + ${resTerm}}"> >>  </a>
                    </li>
                </ul>
            </nav>

        </main>
    </div>
</div>
<script src="/helps/js/jquery-3.7.1.min.js"></script>
<script src="https://unpkg.com/@popperjs/core@2"></script>
<script src="/plugins/bootstrap-4.0.0/js/bootstrap.min.js"></script>
<script src="/helps/js/feather.min.js"></script>
<script>feather.replace()</script>
</body>
</html>




